<template>
    <rx-dialog @handOk="handOk" @cancel="cancel">
        <rx-layout>
            <div slot="center">
                <rx-monaco-editor
                    ref="jsMonacoes"
                    language="javascript"
                    v-model="jsScript"
                    class="monacoEditor"
                >
                    <template v-slot:monacoeditor>
                        <div>
<!--                            <a-dropdown :getPopupContainer="p=>p.parentNode">
                                <a-menu slot="overlay"  >
                                    <template >
                                        <a-menu-item @click="addAjax('get')">get</a-menu-item>
                                        <a-menu-item @click="addAjax('postForm')">postForm</a-menu-item>
                                        <a-menu-item @click="addAjax('postJson')">postJson</a-menu-item>
                                    </template>
                                </a-menu>
                                <a-button style="margin-left: 8px" size="small">{{i18n('insertAjax','插入AJAX函数')}}<a-icon type="down" /> </a-button>
                            </a-dropdown>-->
                            <rx-common-script  @select="insertScript" use-to="portal-customPortal" type="0" >
                                <template v-slot:button>
                                    <a-button style="margin-left: 8px" size="small">{{i18n('insertCode','插入代码')}}<a-icon type="down" /> </a-button>
                                </template>
                            </rx-common-script>
                            <a-button size="small" style="margin-left: 8px" @click="addInvokeCustomQuery">{{i18n('insertQuery','插入调用查询')}}</a-button>
                            <a-button size="small" style="margin-left: 8px" @click="addInvokeScript">{{i18n('insertScript','插入调用脚本')}}</a-button>
                        </div>
                    </template>
                </rx-monaco-editor>
            </div>
        </rx-layout>
    </rx-dialog>
</template>

<script>
import {RxDialog, RxLayout,Util,RxMonacoEditor,RxCommonScript} from "@lowcode/jpaas-common-lib";
import scriptInsert from "@/views/modules/form/core/js/scriptInsert.js"

export default {
    name: "CustomChartJs",
    mixins:[scriptInsert],
    props: {
        config:{
            type:Object
        },
        layerid: {
            type: String,
            default: ""
        },
        destroy: {
            type: Function
        },
    },
    components: {
        RxDialog,
        RxLayout,
        RxMonacoEditor,
        RxCommonScript
    },
    data() {
        return {
            jsScript:"export default {\n" +
                "   //"+this.i18n('defaultJsDesc1','数据定义')+"\n" +
                "    data(){\n" +
                "        return {\n" +
                "        }\n" +
                "    },\n" +
                "    //"+this.i18n('defaultJsDesc2','初始化时加载')+"\n" +
                "    created(){\n" +
                "    },\n" +
                "    //"+this.i18n('defaultJsDesc3','页面自定义函数')+"\n" +
                "    methods:{\n" +
                "        /**\n" +
                "         * "+this.i18n('defaultJsDesc4','option为配置项')+"\n" +
                "         */\n" +
                "       setOption(){\n" +
                "            this.option={\n" +
                "              \n" +
                "            }\n" +
                "       }\n" +
                "    },\n" +
                "    //"+this.i18n('defaultJsDesc5','页面自定义观察函数')+"\n" +
                "    watch:{}\n" +
                "}",
        }
    },
    created() {
        if(this.config && this.config.jsScript){
            this.jsScript=this.config.jsScript;
        }
    },
    methods: {
        i18n(name,text,key){
            return this.$ti18(name,text,"scriptInsertLang",key);
        },
        cancel() {
            Util.closeWindow(this, "cancel");
        },
        handOk() {
            Util.closeWindow(this, "ok",this.jsScript);
        },
    },
    watch: {}
}
</script>

<style scoped>
.ant-dropdown{
    z-index: 30000 !important;
}
</style>